<template>
	<AdminLayout activeKey="refund-management" :breadcrumbs="['首页','订单与交易管理','退款管理']" tabTitle="退款管理" :loading="isLoading">
		<view class="page">
			<view class="section-header">
		<text class="section-title">退款管理</text>
		<text class="section-desc">管理纠纷处理产生的退款记录</text>
			</view>

		<!-- 统计卡片 -->
		<view class="stats-grid">
			<view class="stat-card">
				<view class="stat-value">{{ statistics.total }}</view>
				<view class="stat-label">总退款数</view>
				<view class="stat-desc">所有退款记录</view>
			</view>
			<view class="stat-card">
				<view class="stat-value">{{ statistics.approved }}</view>
				<view class="stat-label">处理中</view>
				<view class="stat-desc">等待退款到账</view>
			</view>
			<view class="stat-card">
				<view class="stat-value">{{ statistics.completed }}</view>
				<view class="stat-label">已完成</view>
				<view class="stat-desc">退款已到账</view>
			</view>
			<view class="stat-card">
				<view class="stat-value">¥{{ statistics.totalAmount.toFixed(2) }}</view>
				<view class="stat-label">总退款金额</view>
				<view class="stat-desc">累计退款金额</view>
			</view>
		</view>

			<!-- 筛选工具栏 -->
			<view class="filter-toolbar">
				<input 
					class="search-input" 
					v-model="filters.keyword" 
					placeholder="搜索订单ID或用户名" 
					@input="onSearchInput"
				/>
				<picker mode="selector" :range="statusOptions" @change="onStatusChange">
					<view class="picker-btn">状态：{{ filters.status || '全部' }}</view>
				</picker>
				<picker mode="selector" :range="reasonOptions" @change="onReasonChange">
					<view class="picker-btn">原因：{{ filters.reason || '全部' }}</view>
				</picker>
				<picker mode="date" @change="onStartDateChange">
					<view class="picker-btn">开始：{{ filters.startDate || '选择日期' }}</view>
				</picker>
				<picker mode="date" @change="onEndDateChange">
					<view class="picker-btn">结束：{{ filters.endDate || '选择日期' }}</view>
				</picker>
				<button class="filter-btn" @click="refreshData">刷新</button>
			</view>

			<!-- 显示统计 -->
			<view class="display-stats">
				<text class="stats-text">数据库总记录：{{ statistics.total }}条</text>
				<text class="stats-text">当前显示：{{ displayList.length }}条</text>
				<text class="stats-text">当前显示金额：¥{{ currentDisplayAmount.toFixed(2) }}</text>
			</view>

			<!-- 退款列表 -->
			<view class="content-area">
				<scroll-view scroll-y class="refund-list">
					<view v-for="refund in displayList" :key="refund._id" class="refund-item" :class="refund.status">
						<view class="refund-header">
							<view class="refund-meta">
								<text class="refund-amount">¥{{ refund.refund_amount }}</text>
								<text class="status-tag" :class="refund.status">{{ getStatusText(refund.status) }}</text>
							</view>
							<text class="refund-time">{{ formatTime(refund.apply_time) }}</text>
						</view>

						<view class="refund-content">
							<text class="task-title">任务：{{ refund.task_title }}</text>
							<text class="task-info">订单ID：{{ refund.task_id }}</text>
							<text class="task-info">申请人：{{ refund.applicant_name }}（{{ refund.applicant_role === 'publisher' ? '发布者' : '接单人' }}）</text>
						</view>

						<view class="refund-detail">
							<text class="detail-label">退款原因</text>
							<text class="detail-content">{{ getReasonText(refund.reason) }}</text>
							<text class="detail-content" v-if="refund.reason_detail">{{ refund.reason_detail }}</text>
						</view>

						<!-- 审核信息 -->
						<view class="refund-detail" v-if="refund.status !== 'pending'">
							<text class="detail-label">审核信息</text>
							<view class="audit-info">
								<text class="audit-item">审核人：{{ refund.auditor_name || '系统自动' }}</text>
								<text class="audit-item">审核时间：{{ formatTime(refund.audit_time) }}</text>
								<text class="audit-item" v-if="refund.audit_remark">备注：{{ refund.audit_remark }}</text>
							</view>
						</view>

						<!-- 退款进度 -->
						<view class="refund-detail" v-if="refund.status === 'approved' || refund.status === 'completed'">
							<text class="detail-label">退款进度</text>
							<view class="progress-info">
								<text class="progress-item" :class="{ active: refund.progress >= 1 }">✓ 申请提交</text>
								<text class="progress-item" :class="{ active: refund.progress >= 2 }">✓ 审核通过</text>
								<text class="progress-item" :class="{ active: refund.progress >= 3 }">{{ refund.progress >= 3 ? '✓' : '○' }} 退款处理中</text>
								<text class="progress-item" :class="{ active: refund.progress >= 4 }">{{ refund.progress >= 4 ? '✓' : '○' }} 退款完成</text>
							</view>
						</view>

					<view class="refund-actions">
						<button size="mini" @click="viewTaskDetail(refund.task_id)">查看订单</button>
						<button size="mini" type="primary" v-if="refund.status === 'approved'" @click="processRefund(refund)">确认退款</button>
					</view>
					</view>

					<view v-if="displayList.length === 0" class="empty-tip">
						<text class="empty-icon">💰</text>
						<text class="empty-text">暂无退款记录</text>
					</view>
				</scroll-view>

				<!-- 分页 -->
				<view class="pagination" v-if="pagination.total > 0">
					<button 
						:disabled="pagination.page <= 1" 
						@click="changePage(pagination.page - 1)"
						size="mini"
					>
						上一页
					</button>
					<text class="page-info">{{ pagination.page }} / {{ pagination.totalPages }}</text>
					<button 
						:disabled="pagination.page >= pagination.totalPages" 
						@click="changePage(pagination.page + 1)"
						size="mini"
					>
						下一页
					</button>
				</view>
			</view>
		</view>
	</AdminLayout>
</template>

<script>
import AdminLayout from '@/components/AdminLayout.vue'

export default {
	components: { AdminLayout },
	data() {
		return {
			isLoading: false,
			filters: {
				keyword: '',
				status: '',
				reason: '',
				startDate: '',
				endDate: ''
			},
			statusOptions: ['全部', '处理中', '已完成'],
			reasonOptions: ['全部', '任务取消', '超时未完成', '质量问题', '双方协商', '其他原因'],
			allRefunds: [],
			displayList: [],
			statistics: {
				total: 0,
				pending: 0,
				approved: 0,
				rejected: 0,
				completed: 0,
				totalAmount: 0
			},
			pagination: {
				page: 1,
				pageSize: 20,
				total: 0,
				totalPages: 0
			},
			searchTimer: null
		}
	},

	computed: {
		// 当前显示的退款总额
		currentDisplayAmount() {
			return this.displayList.reduce((sum, refund) => sum + parseFloat(refund.refund_amount || 0), 0)
		}
	},

	mounted() {
		this.loadRefundRecords()
	},

	methods: {
		// 加载退款记录
		async loadRefundRecords() {
			this.isLoading = true
			try {
				const { result } = await uniCloud.callFunction({
					name: 'getRefundRecords',
					data: {
						isAdmin: true,
						page: this.pagination.page,
						pageSize: this.pagination.pageSize
					}
				})

				if (result && result.code === 200) {
					this.allRefunds = result.data.records || []
					this.pagination = {
						page: result.data.page || 1,
						pageSize: result.data.pageSize || 20,
						total: result.data.total || 0,
						totalPages: result.data.totalPages || 0
					}
					
					// 计算统计数据
					this.calculateStatistics()
					
					// 应用筛选
					this.applyFilters()
					
					uni.showToast({ title: `加载${this.allRefunds.length}条记录`, icon: 'success', duration: 1500 })
				} else {
					throw new Error(result?.msg || '加载失败')
				}
			} catch (error) {
				console.error('加载退款记录失败:', error)
				uni.showToast({ title: '加载失败，使用演示数据', icon: 'none' })
				this.loadMockData()
			} finally {
				this.isLoading = false
			}
		},

		// 加载模拟数据
		loadMockData() {
		this.allRefunds = [
			{
				_id: '1',
				task_id: 'task_001',
				task_title: '代买午餐',
				refund_amount: 50.00,
				applicant_name: '张三',
				applicant_role: 'publisher',
				status: 'approved',
				reason: 'task_cancelled',
				reason_detail: '管理员处理纠纷：取消订单并退款',
				apply_time: Date.now() - 3600000,
				auditor_name: '管理员',
				audit_time: Date.now() - 3600000,
				audit_remark: '管理员处理纠纷自动批准',
				progress: 3
			},
			{
				_id: '2',
				task_id: 'task_002',
				task_title: '快递代取',
				refund_amount: 25.00,
				applicant_name: '李四',
				applicant_role: 'publisher',
				status: 'approved',
				reason: 'task_cancelled',
				reason_detail: '管理员处理纠纷：接单人未按时完成任务',
				apply_time: Date.now() - 7200000,
				auditor_name: '管理员',
				audit_time: Date.now() - 7200000,
				audit_remark: '管理员处理纠纷自动批准',
				progress: 3
			},
			{
				_id: '3',
				task_id: 'task_003',
				task_title: '代购图书',
				refund_amount: 80.00,
				applicant_name: '王五',
				applicant_role: 'publisher',
				status: 'completed',
				reason: 'task_cancelled',
				reason_detail: '管理员处理纠纷：购买的书籍不符合要求',
				apply_time: Date.now() - 86400000,
				auditor_name: '管理员',
				audit_time: Date.now() - 86400000,
				audit_remark: '管理员处理纠纷自动批准',
				progress: 4
			},
			{
				_id: '4',
				task_id: 'task_004',
				task_title: '帮忙送文件',
				refund_amount: 30.00,
				applicant_name: '小明',
				applicant_role: 'publisher',
				status: 'completed',
				reason: 'task_cancelled',
				reason_detail: '管理员处理纠纷：双方协商取消订单',
				apply_time: Date.now() - 172800000,
				auditor_name: '管理员',
				audit_time: Date.now() - 172800000,
				audit_remark: '管理员处理纠纷自动批准',
				progress: 4
			},
			{
				_id: '5',
				task_id: 'task_005',
				task_title: '代购零食',
				refund_amount: 45.00,
				applicant_name: '小李',
				applicant_role: 'publisher',
				status: 'approved',
				reason: 'task_cancelled',
				reason_detail: '管理员处理纠纷：双方协商一致取消任务',
				apply_time: Date.now() - 1800000,
				auditor_name: '管理员',
				audit_time: Date.now() - 1800000,
				audit_remark: '管理员处理纠纷自动批准',
				progress: 3
			}
		]
			
			this.pagination = {
				page: 1,
				pageSize: 20,
				total: this.allRefunds.length,
				totalPages: 1
			}
			
			this.calculateStatistics()
			this.applyFilters()
		},

		// 计算统计数据
		calculateStatistics() {
			this.statistics = {
				total: this.allRefunds.length,
				pending: this.allRefunds.filter(r => r.status === 'pending').length,
				approved: this.allRefunds.filter(r => r.status === 'approved').length,
				rejected: this.allRefunds.filter(r => r.status === 'rejected').length,
				completed: this.allRefunds.filter(r => r.status === 'completed').length,
				totalAmount: this.allRefunds.reduce((sum, r) => sum + parseFloat(r.refund_amount || 0), 0)
			}
		},

		// 应用筛选
		applyFilters() {
			let filteredList = [...this.allRefunds]

			// 关键词搜索
			if (this.filters.keyword && this.filters.keyword.trim()) {
				const keyword = this.filters.keyword.trim().toLowerCase()
				filteredList = filteredList.filter(refund => {
					const taskId = (refund.task_id || '').toLowerCase()
					const applicantName = (refund.applicant_name || '').toLowerCase()
					return taskId.includes(keyword) || applicantName.includes(keyword)
				})
			}

			// 状态筛选
			if (this.filters.status && this.filters.status !== '全部') {
				const statusKey = this.getStatusKey(this.filters.status)
				filteredList = filteredList.filter(refund => refund.status === statusKey)
			}

			// 原因筛选
			if (this.filters.reason && this.filters.reason !== '全部') {
				const reasonKey = this.getReasonKey(this.filters.reason)
				filteredList = filteredList.filter(refund => refund.reason === reasonKey)
			}

			// 日期筛选
			if (this.filters.startDate || this.filters.endDate) {
				filteredList = filteredList.filter(refund => {
					const refundDate = new Date(refund.apply_time)
					const startDate = this.filters.startDate ? new Date(this.filters.startDate) : null
					const endDate = this.filters.endDate ? new Date(this.filters.endDate + ' 23:59:59') : null
					
					let passFilter = true
					if (startDate && refundDate < startDate) passFilter = false
					if (endDate && refundDate > endDate) passFilter = false
					
					return passFilter
				})
			}

			// 按时间倒序排序，待处理的优先
			filteredList.sort((a, b) => {
				if (a.status === 'pending' && b.status !== 'pending') return -1
				if (a.status !== 'pending' && b.status === 'pending') return 1
				return b.apply_time - a.apply_time
			})

			this.displayList = filteredList
		},

		// 获取状态文本
		getStatusText(status) {
			const statusMap = {
				'pending': '待处理',
				'approved': '已通过',
				'rejected': '已拒绝',
				'completed': '已完成'
			}
			return statusMap[status] || status
		},

		// 获取状态key
	getStatusKey(text) {
		const keyMap = {
			'处理中': 'approved',
			'已完成': 'completed'
		}
		return keyMap[text] || text
	},

		// 获取原因文本
		getReasonText(reason) {
			const reasonMap = {
				'task_cancelled': '任务取消',
				'timeout': '超时未完成',
				'quality_issue': '质量问题',
				'mutual_agreement': '双方协商',
				'other': '其他原因'
			}
			return reasonMap[reason] || reason
		},

		// 获取原因key
		getReasonKey(text) {
			const keyMap = {
				'任务取消': 'task_cancelled',
				'超时未完成': 'timeout',
				'质量问题': 'quality_issue',
				'双方协商': 'mutual_agreement',
				'其他原因': 'other'
			}
			return keyMap[text] || text
		},

		// 时间格式化
		formatTime(v) {
			if (!v) return '--'
			const d = new Date(v)
			const p = n => String(n).padStart(2, '0')
			return `${d.getFullYear()}-${p(d.getMonth() + 1)}-${p(d.getDate())} ${p(d.getHours())}:${p(d.getMinutes())}`
		},

		// 查看订单详情
		viewTaskDetail(taskId) {
			uni.navigateTo({
				url: `/pages/admin/order-detail/index?id=${taskId}`
			})
		},

		// 批准退款
		async approveRefund(refund) {
			const confirmed = await this.confirm(`确认批准退款申请？\n退款金额：¥${refund.refund_amount}\n任务：${refund.task_title}`)
			if (!confirmed) return

			const remark = await this.promptRemark('请输入审核备注（选填）')

			try {
				uni.showLoading({ title: '处理中...' })

				const { result } = await uniCloud.callFunction({
					name: 'handleRefund',
					data: {
						refundId: refund._id,
						action: 'approve',
						remark: remark,
						isAdmin: true
					}
				})

				uni.hideLoading()

				if (result && result.code === 200) {
					uni.showToast({ title: '已批准退款', icon: 'success' })
					this.loadRefundRecords()
				} else {
					throw new Error(result?.msg || '处理失败')
				}
			} catch (error) {
				uni.hideLoading()
				console.error('批准退款失败:', error)
				
				// 使用本地模拟
				refund.status = 'approved'
				refund.auditor_name = '管理员'
				refund.audit_time = Date.now()
				refund.audit_remark = remark || '已批准'
				refund.progress = 2
				this.applyFilters()
				uni.showToast({ title: '已批准（演示）', icon: 'success' })
			}
		},

		// 拒绝退款
		async rejectRefund(refund) {
			const remark = await this.promptRemark('请输入拒绝原因')
			if (!remark) return

			try {
				uni.showLoading({ title: '处理中...' })

				const { result } = await uniCloud.callFunction({
					name: 'handleRefund',
					data: {
						refundId: refund._id,
						action: 'reject',
						remark: remark,
						isAdmin: true
					}
				})

				uni.hideLoading()

				if (result && result.code === 200) {
					uni.showToast({ title: '已拒绝退款', icon: 'success' })
					this.loadRefundRecords()
				} else {
					throw new Error(result?.msg || '处理失败')
				}
			} catch (error) {
				uni.hideLoading()
				console.error('拒绝退款失败:', error)
				
				// 使用本地模拟
				refund.status = 'rejected'
				refund.auditor_name = '管理员'
				refund.audit_time = Date.now()
				refund.audit_remark = remark
				this.applyFilters()
				uni.showToast({ title: '已拒绝（演示）', icon: 'success' })
			}
		},

	// 处理退款 - 将退款标记为已完成
	async processRefund(refund) {
		const confirmed = await this.confirm(`确认已完成退款操作？\n退款金额：¥${refund.refund_amount}\n任务：${refund.task_title}\n\n此操作将把退款状态更新为"已完成"`)
		if (!confirmed) return

		try {
			uni.showLoading({ title: '处理中...' })

			const { result } = await uniCloud.callFunction({
				name: 'handleRefund',
				data: {
					refundId: refund._id,
					action: 'complete',
					isAdmin: true
				}
			})

			uni.hideLoading()

			if (result && result.code === 200) {
				uni.showToast({ title: '退款处理完成', icon: 'success' })
				this.loadRefundRecords()
			} else {
				throw new Error(result?.msg || '处理失败')
			}
		} catch (error) {
			uni.hideLoading()
			console.error('处理退款失败:', error)
			
			// 使用本地模拟
			refund.status = 'completed'
			refund.progress = 4
			this.applyFilters()
			uni.showToast({ title: '退款完成（演示）', icon: 'success' })
		}
	},

		// 筛选事件
		onStatusChange(e) {
			const index = Number(e.detail.value)
			this.filters.status = this.statusOptions[index]
			this.applyFilters()
		},

		onReasonChange(e) {
			const index = Number(e.detail.value)
			this.filters.reason = this.reasonOptions[index]
			this.applyFilters()
		},

		onStartDateChange(e) {
			this.filters.startDate = e.detail.value
			this.applyFilters()
		},

		onEndDateChange(e) {
			this.filters.endDate = e.detail.value
			this.applyFilters()
		},

		onSearchInput(e) {
			if (this.searchTimer) {
				clearTimeout(this.searchTimer)
			}
			this.searchTimer = setTimeout(() => {
				this.applyFilters()
			}, 300)
		},

		// 刷新数据
		refreshData() {
			this.loadRefundRecords()
		},

		// 分页
		changePage(page) {
			this.pagination.page = page
			this.loadRefundRecords()
		},

		// 确认对话框
		confirm(message) {
			return new Promise((resolve) => {
				uni.showModal({
					title: '确认操作',
					content: message,
					success: (res) => resolve(res.confirm)
				})
			})
		},

		// 输入备注
		promptRemark(title) {
			return new Promise((resolve) => {
				uni.showModal({
					title: title,
					editable: true,
					placeholderText: '请输入备注...',
					success: (res) => {
						resolve(res.confirm && res.content ? res.content : null)
					}
				})
			})
		}
	}
}
</script>

<style scoped>
.page {
	padding: 20rpx;
	min-height: calc(100vh - 140rpx);
	display: flex;
	flex-direction: column;
}

.section-header {
	margin-bottom: 30rpx;
}

.section-title {
	font-size: 36rpx;
	font-weight: 600;
	color: #333;
	display: block;
	margin-bottom: 8rpx;
}

.section-desc {
	font-size: 26rpx;
	color: #666;
	display: block;
}

/* 统计卡片 */
.stats-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180rpx, 1fr));
	gap: 20rpx;
	margin-bottom: 30rpx;
}

.stat-card {
	background: #fff;
	border-radius: 16rpx;
	padding: 24rpx;
	text-align: center;
	box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
	transition: all 0.3s;
}

.stat-card:hover {
	box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.12);
}

.stat-value {
	font-size: 48rpx;
	font-weight: 700;
	color: #007aff;
	margin-bottom: 8rpx;
}

.stat-label {
	font-size: 26rpx;
	color: #666;
}

.stat-desc {
	font-size: 20rpx;
	color: #999;
	margin-top: 4rpx;
}

/* 筛选工具栏 */
.filter-toolbar {
	display: flex;
	align-items: center;
	gap: 16rpx;
	margin-bottom: 20rpx;
	flex-wrap: wrap;
}

.search-input {
	flex: 2;
	min-width: 300rpx;
	max-width: 500rpx;
	background: #fff;
	border-radius: 16rpx;
	padding: 20rpx 24rpx;
	border: 2rpx solid #e0e0e0;
	font-size: 30rpx;
	height: 88rpx;
	box-sizing: border-box;
	transition: all 0.3s;
}

.search-input:focus {
	border-color: #007aff;
	box-shadow: 0 0 0 4rpx rgba(0, 122, 255, 0.1);
}

.picker-btn {
	padding: 16rpx 20rpx;
	background: #fff;
	border-radius: 12rpx;
	border: 2rpx solid #f0f0f0;
	font-size: 26rpx;
	color: #333;
	white-space: nowrap;
}

.filter-btn {
	padding: 16rpx 24rpx;
	background: #007aff;
	color: #fff;
	border-radius: 12rpx;
	font-size: 26rpx;
	border: none;
}

/* 显示统计 */
.display-stats {
	display: flex;
	align-items: center;
	gap: 20rpx;
	margin-bottom: 20rpx;
	padding: 16rpx 20rpx;
	background: #f8f9fa;
	border-radius: 12rpx;
	border: 1rpx solid #e9ecef;
	flex-wrap: wrap;
}

.stats-text {
	font-size: 24rpx;
	color: #6c757d;
}

.stats-text:first-child {
	font-weight: 600;
	color: #495057;
}

/* 内容区域 */
.content-area {
	flex: 1;
	display: flex;
	flex-direction: column;
	min-height: 0;
}

.refund-list {
	flex: 1;
	overflow-y: auto;
	min-height: 400rpx;
	max-height: calc(100vh - 400rpx);
}

/* 退款项 */
.refund-item {
	background: #fff;
	border-radius: 16rpx;
	padding: 24rpx;
	margin-bottom: 16rpx;
	box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
	border-left: 6rpx solid transparent;
	transition: all 0.3s;
}

.refund-item:hover {
	box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.12);
}

.refund-item.pending {
	border-left-color: #faad14;
}

.refund-item.approved {
	border-left-color: #1890ff;
}

.refund-item.rejected {
	border-left-color: #ff4d4f;
}

.refund-item.completed {
	border-left-color: #52c41a;
}

.refund-header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	margin-bottom: 16rpx;
}

.refund-meta {
	display: flex;
	align-items: center;
	gap: 12rpx;
	flex-wrap: wrap;
}

.refund-amount {
	font-size: 36rpx;
	font-weight: 700;
	color: #ff6b35;
}

.status-tag {
	padding: 6rpx 14rpx;
	border-radius: 12rpx;
	font-size: 24rpx;
	font-weight: 600;
	color: #fff;
}

.status-tag.pending {
	background: #faad14;
}

.status-tag.approved {
	background: #1890ff;
}

.status-tag.rejected {
	background: #ff4d4f;
}

.status-tag.completed {
	background: #52c41a;
}

.refund-time {
	font-size: 24rpx;
	color: #999;
}

.refund-content {
	display: flex;
	flex-direction: column;
	gap: 8rpx;
	margin-bottom: 16rpx;
}

.task-title {
	font-size: 30rpx;
	font-weight: 600;
	color: #333;
}

.task-info {
	font-size: 24rpx;
	color: #666;
}

.refund-detail {
	background: #f8f9fa;
	border-radius: 12rpx;
	padding: 16rpx;
	margin-bottom: 12rpx;
}

.detail-label {
	font-size: 24rpx;
	color: #999;
	display: block;
	margin-bottom: 8rpx;
}

.detail-content {
	font-size: 26rpx;
	color: #333;
	line-height: 1.6;
	display: block;
}

.audit-info, .progress-info {
	display: flex;
	flex-direction: column;
	gap: 8rpx;
}

.audit-item, .progress-item {
	font-size: 24rpx;
	color: #666;
}

.progress-item {
	position: relative;
	padding-left: 24rpx;
	color: #ccc;
}

.progress-item.active {
	color: #52c41a;
	font-weight: 600;
}

.refund-actions {
	display: flex;
	gap: 12rpx;
	justify-content: flex-end;
	flex-wrap: wrap;
	margin-top: 8rpx;
}

.refund-actions button {
	padding: 12rpx 20rpx;
	border-radius: 8rpx;
	font-size: 24rpx;
	border: none;
	transition: all 0.3s;
}

/* 空状态 */
.empty-tip {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 100rpx 20rpx;
	text-align: center;
}

.empty-icon {
	font-size: 120rpx;
	margin-bottom: 20rpx;
}

.empty-text {
	font-size: 28rpx;
	color: #999;
}

/* 分页 */
.pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20rpx;
	margin-top: 20rpx;
	padding: 20rpx;
	background: #fff;
	border-radius: 12rpx;
	box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.06);
}

.page-info {
	font-size: 26rpx;
	color: #666;
	min-width: 120rpx;
	text-align: center;
}

.pagination button {
	padding: 12rpx 20rpx;
	border-radius: 8rpx;
	font-size: 24rpx;
	border: 1rpx solid #dee2e6;
	background: #fff;
	color: #007aff;
	transition: all 0.3s;
}

.pagination button:disabled {
	background: #f8f9fa;
	color: #6c757d;
	cursor: not-allowed;
}

.pagination button:not(:disabled):hover {
	background: #007aff;
	color: #fff;
}

/* 响应式 */
@media (max-width: 750rpx) {
	.stats-grid {
		grid-template-columns: repeat(2, 1fr);
	}
	
	.filter-toolbar {
		flex-direction: column;
		align-items: stretch;
	}
	
	.search-input {
		max-width: 100%;
	}
}
</style>

